import React from "react";
import {Badge, Center} from "@mantine/core";
import {DataTableColumn} from "mantine-datatable";
import {RecordProps} from "./interface";
import {renderColumnAction} from "./renderColumnAction";

// 引入ts类型，更容易知道哪些属性可以配置
export const renderColumns: DataTableColumn<RecordProps>[] = [
  {
    accessor: "name", // 本列锚点（并不是一定是属性名）
    title: "项目名称", // 显示列名
    textAlign: "left", // 文本对齐（ipdv2要求：首列必须左对齐）
    width: 400, // 默认列宽
    ellipsis: true, // 超过列宽显示为省略号
    resizable: true, // 列宽可调
  },
  {accessor: "type", title: "类型"},
  {accessor: "oaId", title: "大生产项目编号", sortable: true},
  {
    accessor: "stage",
    title: "状态",
    render: ({stage}) => (
      <Center>
        <Badge
          miw={70}
          variant="dot"
          color={
            stage === "设计中"
              ? "green"
              : stage === "审核中"
                ? "grape"
                : stage === "已结束"
                  ? "blue"
                  : "red" // 系统BUG显示红色
          }
        >
          {stage}
        </Badge>
      </Center>
    ),
  },
  {accessor: "createdByUserName", title: "创建人"},
  {accessor: "createdByUserId", title: "创建人账号"},
  {accessor: "createdTime", title: "创建时间", sortable: true},
  {accessor: "executedByUserName", title: "执行人"},
  {accessor: "executedByUserId", title: "执行人账号"},
  {accessor: "executeSendTime", title: "执行时间", sortable: true},
  {accessor: "reviewedByUserName", title: "审核人"},
  {accessor: "reviewedByUserId", title: "审核人账号"},
  {accessor: "reviewPassedTime", title: "审核时间", sortable: true},
  {
    accessor: "actions",
    title: "操作",
    render: renderColumnAction,
  },
];
